@keyframes fadeInLeft{
    0% {
        opacity: 0;
        filter: alpha(opacity=0);
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        -webkit-transform: translate3d(-100px,0,0);
        -moz-transform: translate3d(-100px,0,0);
        -o-transform: translate3d(-100px,0,0);
        transform: translate3d(-100px,0,0);
    }
    100% {
        opacity: 1;
        filter: alpha(opacity=100);
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        -webkit-transform: translate3d(0,0,0);
        -moz-transform: translate3d(0,0,0);
        -o-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
    }
}

@keyframes fadeInRight {
    0% {
        opacity:0;
        filter:alpha(opacity=0);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        -webkit-transform:translate3d(100px,0,100px);
        -moz-transform:translate3d(100px,0,100px);
        -o-transform:translate3d(100px,0,100px);
        transform:translate3d(100px,0,100px)
    }
    100% {
        opacity:1;
        filter:alpha(opacity=100);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        -webkit-transform:translate3d(0,0,0);
        -moz-transform:translate3d(0,0,0);
        -o-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
}
@keyframes fadeInBottom {
    0% {
        opacity:0;
        filter:alpha(opacity=0);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        -webkit-transform:translate3d(0,20px,0);
        -moz-transform:translate3d(0,20px,0);
        -o-transform:translate3d(0,20px,0);
        transform:translate3d(0,20px,0)
    }
    100% {
        opacity:1;
        filter:alpha(opacity=100);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        -webkit-transform:translate3d(0,0,0);
        -moz-transform:translate3d(0,0,0);
        -o-transform:translate3d(0,0,0);
        transform:translate3d(0,0,0)
    }
}
@keyframes fadeIn {
    0% {
        opacity:0;
        filter:alpha(opacity=0);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true);
        visibility:visible
    }
    100% {
        opacity:1;
        filter:alpha(opacity=100);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true)
    }
}
@keyframes fadeOut {
    0% {
        opacity:1;
        filter:alpha(opacity=100);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true)
    }
    100% {
        opacity:0;
        filter:alpha(opacity=0);
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',enabled=true)
    }
}


.fadeInLeft{
    position: relative;
    animation: fadeInLeft 2s ease-out 0s 1 normal running;
    -webkit-animation: fadeInLeft 2s ease-out 0s 1 normal running;
    -moz-animation: fadeInLeft 2s ease-out 0s 1 normal running;
    -o-animation : fadeInLeft 2s ease-out 0s 1 normal running;
    animation-fill-mode: both;
}
.fadeInRight{
    position: relative;
    animation: fadeInRight 2s ease-out 0s 1 normal running;
    -webkit-animation: fadeInRight 2s ease-out 0s 1 normal running;
    -moz-animation: fadeInRight 2s ease-out 0s 1 normal running;
    -o-animation : fadeInRight 2s ease-out 0s 1 normal running;
    animation-fill-mode: both;
}
.fadeInBottom{
    position: relative;
    animation: fadeInBottom 2s ease-out 0s 1 normal running;
    -webkit-animation: fadeInBottom 2s ease-out 0s 1 normal running;
    -moz-animation: fadeInBottom 2s ease-out 0s 1 normal running;
    -o-animation : fadeInBottom 2s ease-out 0s 1 normal running;
    animation-fill-mode: both;
}
.fadeIn{
    position: relative;
    animation: fadeIn 2s ease-out 0s 1 normal running;
    -webkit-animation: fadeIn 2s ease-out 0s 1 normal running;
    -moz-animation: fadeIn 2s ease-out 0s 1 normal running;
    -o-animation : fadeIn 2s ease-out 0s 1 normal running;
    animation-fill-mode: both;
}
.fadeOut{
    position: relative;
    animation: fadeOut 2s ease-out 0s 1 normal running;
    -webkit-animation: fadeOut 2s ease-out 0s 1 normal running;
    -moz-animation: fadeOut 2s ease-out 0s 1 normal running;
    -o-animation : fadeOut 2s ease-out 0s 1 normal running;
    animation-fill-mode: both;
}